<template>
	<view class="content" @click="show=!show">
		<view class="top" @click="$my.go()" v-show="this.show">
			<u-icon name="close" color="#ffffff"></u-icon>
		</view>
		<view class="swiper">
			<u-swiper :list="list6" @change="e => currentNum = e.current" :autoplay="false"
				indicatorStyle="right: 20px">
				<view slot="indicator"  v-show="this.show" class="indicator-num">
					<text class="indicator-num__text">{{ currentNum + 1 }}/{{ list6.length }}</text>
				</view>
			</u-swiper>
		</view>
		<view class="bottom "  v-show="this.show">
			<view class="flex">
				<u--image src="https://cdn.uviewui.com/uview/album/1.jpg"width="48rpx" height="48rpx" shape="circle"></u--image>
				<text class="cof">j**48</text>
			</view>
			<view class="fontS22 cof" style="margin-top: 8rpx;">
				收到货了，质量很好，非常满意！
			</view>
			<view class="fontS22 co9" style="margin-top: 16rpx;margin-bottom: 108rpx;">
				45件·颜色/中级中阶#343
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {

				list6: [
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
				],
				currentNum: '',
				show:false,
			}
		},
		methods: {
			
		},
		onLoad(option) {
			console.log(option.id);
		}
	}
</script>

<style lang="scss">
	/deep/.indicator-num {
		position: fixed;
		left: 45%;
		top: 5%;
	}

	.indicator-num {
		padding: 2px 0;
		background-color: rgba(0, 0, 0, 0.35);
		border-radius: 100px;
		width: 35px;
		@include flex;
		justify-content: center;

		&__text {
			color: #FFFFFF;
			font-size: 12px;
		}
	}

	.content {
		width: 100%;
		height: 1460rpx;
		// flex-shrink: 0;
		// background-color: black;
		// border: 2rpx solid transparent;
		position: relative;
		background-color: black;

		.swiper {
			position: fixed;
			width: 100%;
			top: 40%;
		}
		.top{
			position: fixed;
			top: 5%	;
			left: 4%;
			// background-color: #FFFFFF;
		}
		.bottom{
			position: fixed;
			bottom: 0;
			left: 4%;
		}
	}
</style>
